<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:insert="~{include :: header('时间轴')}" />
	<th:block th:insert="~{include :: select2-css}" />
</head>
<body class="gray-bg">
     <div class="container-div">
        <div class="row">
            <div class="col-sm-12 search-collapse" style="margin-bottom: 20px;">
                <form id="formId">
                    <div class="select-list">
                        <ul>
                            <li>
                               <label>跟踪：</label>
								<select id="trackerId" name="trackerId" class="form-control" required>
							   		<option value="">所有</option>
								    <option th:each="tracker : ${trackerList}" th:text="${tracker['name']}" th:value="${tracker['id']}"></option>
								</select>
                            </li>
                            <li>
                                <label>项目：</label>
								<select id="projectId" name="projectId" class="form-control" required>
									<option value="">所有</option>
								    <option th:each="project : ${projectList}" th:text="${project['name'] + ' (' + project['customerName'] + ')'}" th:value="${project['id']}"></option>
								</select>
                            </li>
                            <li>
                                <label>状态：</label>
								<select id="statusId" name="statusId" class="form-control">
									<option value="">所有</option>
									<option value="0" selected>打开</option>
								    <option th:each="issueStatuse : ${issueStatuseList}" th:text="${issueStatuse['name']}" th:value="${issueStatuse['id']}"></option>
								</select>
                            </li>
                            <li>
                                <label>指派给：</label>
								<select id="assignedToId" name="assignedToId" class="form-control" >			
									<option value="">&emsp;</option>
									<option th:each="user : ${userList}" th:text="${user['userName']}" th:value="${user['userId']}" th:selected="${user['userId'] == curUserId}"></option>
								</select>
                            </li>
                            <li>
                                <label>优先级：</label>
								<select id="priorityId" name="priorityId" class="form-control" >	
									<option value="">所有</option>
									<option th:each="issuePrioritie : ${issuePrioritieList}" th:text="${issuePrioritie['name']}" th:value="${issuePrioritie['id']}"></option>
								</select>
                            </li>
                            <li>
                                <label>% 进度：</label>
								<select name="doneRatio" id="doneRatio" class="form-control">
									<option value="">所有</option>
									<option value="0">0 %</option>
									<option value="10">10 %</option>
									<option value="20">20 %</option>
									<option value="30">30 %</option>
									<option value="40">40 %</option>
									<option value="50">50 %</option>
									<option value="60">60 %</option>
									<option value="70">70 %</option>
									<option value="80">80 %</option>
									<option value="90">90 %</option>
									<option value="100">100 %</option>
								</select>
                            </li>
							<li style="display: flex; align-items: center;">
							    <label style="white-space: nowrap; margin: 0; min-width: 60px;">开始时间：</label>
							    <input type="date" name="sDate" id="startDate" class="form-control" style="flex: 1; min-width: 150px;" th:value="${sDate}" />
							</li>
							<li style="display: flex; align-items: center;">
							    <label style="white-space: nowrap; margin: 0; min-width: 60px;">结束时间：</label>
							    <input type="date" name="eDate" id="endDate" class="form-control" style="flex: 1; min-width: 150px;" th:value="${eDate}" />
							</li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="timeLineSearch()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>
			<div class="ibox float-e-margins" style="border: none; background-color: transparent;">
			    <div id="ibox-content">
			        <div id="vertical-timeline" class="vertical-container light-timeline">
			            
			        </div>
			    </div>
			</div>
        </div>
    </div>
    <th:block th:insert="~{include :: footer}" />
	<th:block th:insert="~{include :: select2-js}" />
    <script th:inline="javascript">
		var detailFlag = [[${@permission.hasPermi('project:issue:detail')}]];
        var editFlag = [[${@permission.hasPermi('project:issue:edit')}]];
        var prefix = ctx + "my/workbench";
        $(function(){
			timeLineSearch();
		})
        // 异步搜索函数
        function timeLineSearch() {
            // 获取表单数据
            var param = $("#formId").serialize();
            // 显示加载状态
            $('#ibox-content').addClass('sk-loading');

            // 发送AJAX请求
            $.ajax({
                url: prefix + '/timeline/view',
                type: 'POST',
                data: param,
                success: function(result) {
					$('#vertical-timeline').html(result);
                    $('#ibox-content').removeClass('sk-loading');
                },
                error: function(xhr, status, error) {
                    console.error('搜索失败:', error);
                    $('#ibox-content').removeClass('sk-loading');
                    $.modal.alertError('搜索失败，请重试');
                }
            });
        }
    </script>
</body>
</html>
